<template>
	<view>
		<view class="con con-top">
			<view class="box">
				<view class="box-title">
					<text>允许任何人加群</text>
				</view>
				<view class="box-selected" @click="changeSelected('2')">
					<text v-if="inviteType != '1'">√</text>
				</view>
			</view>
		</view>
		<view class="con">
			<view class="box">
				<view class="box-title">
					<text>需要身份验证</text>
				</view>
				<view class="box-selected" @click="changeSelected('1')">
					<text v-if="inviteType == '1'">√</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		queryGroupByHeadInfo,
		changeGroupState
	} from '@/api/http/msg/group.js'

	export default {
		data() {
			return {
				groupId: 0,
				userId: uni.getStorageSync('userId'),
				inviteType: '',
				initialInviteType: ''
			}
		},
		methods: {
			queryGroupByHeadInfo(groupId) {
				queryGroupByHeadInfo(groupId, this.userId).then(res => {
					if (res.data.pubInfo.code !== 0) {
						return uni.$showMsg(res.data.pubInfo.message);
					}
					this.inviteType = res.data.busInfo.inviteType
					this.initialInviteType = res.data.busInfo.inviteType
					//console.log(res.data.busInfo)
				})
			},
			changeSelected(e) {
				//console.log(e)
				this.inviteType = e
			}
		},
		//点击完成，保存设置
		onNavigationBarButtonTap() {
			if (this.initialInviteType == this.inviteType) {
				console.log('没有更改！')
				return;
			}
			//groupId, estoppel, protect, inviteType
			changeGroupState(this.groupId, '', '', this.inviteType).then(res => {
				if (res.data.pubInfo.code !== 0) {
					return uni.$showMsg(res.data.pubInfo.message);
				}
				return uni.$showMsg('修改成功！');
			})
		},
		onLoad(e) {
			this.groupId = e.groupId
			this.queryGroupByHeadInfo(e.groupId)
		}
	}
</script>

<style lang="scss">
	page {
		background: #eee;
	}

	.con-top {
		margin-top: 30rpx;
	}

	.con {
		width: 100%;
		height: 100rpx;
		background: #fff;

		.box {
			width: 92%;
			margin-left: 4%;
			display: flex;
			justify-content: space-between;

			.box-title {
				height: 100rpx;
				line-height: 100rpx;
				width: 50%;

				text {
					font-size: 32rpx;
				}
			}

			.box-selected {
				height: 100rpx;
				line-height: 100rpx;
				width: 50%;
				text-align: right;

				text {
					font-size: 32rpx;
					color: #01DAFE;
				}
			}
		}
	}
</style>